<template>
  <view class="order-operate-section" v-if="operateBtnWord.greyStr || operateBtnWord.redStr">
    <view
      class="cancle-btn button-xl"
      @click.stop="handleBtn(operateBtnWord.greyStr)"
      v-if="operateBtnWord.greyStr"
      >{{ operateBtnWord.greyStr }}</view
    >
    <view
      class="confirm-btn button-xl"
      v-if="operateBtnWord.redStr"
      @click.stop="handleBtn(operateBtnWord.redStr)"
      >{{ operateBtnWord.redStr }}</view
    >
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
    order: {
      type: Object,
      default: function () {
        return null;
      },
    },
  },
  computed: {
    operateBtnWord() {
      let redStr = "",
        greyStr = "";
      if(this.order.is_user_cancel == 1) {
        redStr = this.$t('order.del')
      }else {
        // refund_status 0处理中  1已同意退货 3拒绝
        if (this.order.refund_status == 0) {
          if (this.order.is_agree == 0 && this.order.is_user_send == 0) {
            greyStr = this.$t('order.cancleApp');
          }
          if (this.order.is_agree == 1 && this.order.is_user_send == 0) {
            redStr = this.$t('order.confirmSend');
            greyStr = this.$t('order.cancleApp');
          }
          if (this.order.is_agree == 1 && this.order.is_user_send == 1) {
            redStr = "";
          }
        }
        if (this.order.refund_status == 1) {
          redStr = this.$t('order.del');
        }
        if (this.order.refund_status == 3) {
          redStr = this.$t('diy.contact');
          greyStr = this.$t('order.cancleApp');
        }
      }
      return { redStr, greyStr };
    },
  },
  methods: {
    handleBtn(e) {
      this.$emit("btn",e);
    },
  },
};
</script>

<style lang="scss"scoped>
// .foot-btn-groups {
//   width: 100%;
//   height: 99rpx;
//   background: #ffffff;
//   border: 1rpx solid #f0f0f0;
//   position: fixed;
//   left: 0;
//   bottom: 0;
//   z-index: 12;
//   padding-right: 35rpx;
//   display: flex;
//   justify-content: flex-end;
//   align-items: center;

//   view {
//     width: 152rpx;
//     height: 60rpx;
//     background: linear-gradient(90deg, #f2140c, #f14c0c);
//     border-radius: 30rpx;
//     display: flex;
//     justify-content: center;
//     align-items: center;
//     font-size: 24rpx;
//     font-weight: 500;
//     font-size: 24rpx;
//     font-family: PingFang SC;
//     font-weight: 400;
//     color: #ffffff;
//   }
// }
.order-operate-section {
  background-color: #fff;
  position: fixed;
  bottom: 0;
  left: 0;
  padding-right:  36rpx;
  width: 100%;
  height: calc(100rpx);
  height: calc(100rpx + constant(safe-area-inset-bottom));
  height: calc(100rpx + env(safe-area-inset-bottom));
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
  display: flex;
  justify-content: flex-end;
  align-items: center;
  .button-xl {
    font-size: 26rpx;
    font-family: PingFang SC;
    font-weight: 400;
    width: 152rpx;
    height: 60rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 30rpx;
  }

  .cancle-btn {
    color: #262626;
    border: 2rpx solid #8c8c8c;
  }

  .confirm-btn {
    color: #f7271f;
    border: 2rpx solid #f7271f;
    margin-left: 24rpx;
  }
}
</style>
